<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>0000</title>
        <style>
            ul {
                margin:0;
                padding:0;
                list-style-type:none;
            }
            li {
                float:left;
                width:100px;
                height:30px;
                line-height:30px;
                text-align:center;
                -webkit-transform:skewX(15deg);
                background:red;
            }
            li:nth-of-type(2) {
                border-left:2px solid #fff;
            }
            a {
                text-decoration:none;
                color:#fff;
                font-size:20px;
                display:block;
                -webkit-transform:skewX(-15deg);
            }
        </style>
    </head>
    <body>
        <ul>
            <li><a href="javascript:;">home</a></li>
            <li><a href="javascript:;">about</a></li>
        </ul>
    </body>
</html>